<template>
	<view class="body">
		<view class="top_box">
			<image src="../../static/review.png" class="review_pic" mode="aspectFit"></image>
			<text class="top_text">快来评价一下吧！</text>
		</view>
		<view class="gray"></view>
		<!-- 物品列表 -->
		<block v-for="(item,index) in orderList" :key="index">
			<view class="order_list">
				<text>{{item}}</text>
				<view class="review_box">
					<view :class="[likeBoxClass,isLike[index].active?activeFontClass:'']" @click="loveMe" :data-index="index">
						<view class="iconfont icon-like icon-font"></view>
						<view>喜欢</view>
					</view>
					<view :class="[likeBoxClass,isDislike[index].active?activeFontClass:'']" @click="hateMe" :data-index="index">
						<view class="iconfont icon-dislike icon-font"></view>
						<view>不喜欢</view>
					</view>
				</view>
			</view>
		</block>
		<view class="bottom_box">
			<button type="primary" @click="done" class="button">完成</button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderList: [],
				isLike: [],
				isDislike: [],
				reviewList: [],
				likeBoxClass: 'like_box',
				activeFontClass: 'active_font',
				activedislikeFontClass: 'active_dislike_font',
				feedbackFlag: false
			}
		},
		onLoad() {
			// 获取订单列表
			var orderList = uni.getStorageSync('orderList');
			var foodIdList = [];
			for (var i in orderList) {

				if (!this.orderList.includes(orderList[i].foodName)) {

					this.orderList.push(orderList[i].foodName);
					foodIdList.push(orderList[i].foodId);
				}
			}

			// console.log(this.orderList)

			for (var i in this.orderList) {
				// console.log(i)
				var tmp = {}
				var tmp1 = {}
				tmp.flag = false;
				tmp.active = false;
				tmp1.flag = false;
				tmp1.active = false;
				this.isLike.push(tmp);
				this.isDislike.push(tmp1)

				this.reviewList.push({})
				this.reviewList[i].foodId = foodIdList[i]

			}
			// console.log(this.reviewList)
		},
		onUnload() {
			// 清空数据
			try {
				uni.setStorageSync('orderList', '');
				uni.setStorageSync('orderId', '');
			} catch (e) {
				//TODO handle the exception
				console.log(e)
			}
		},
		methods: {
			// 点赞
			loveMe(e) {
				var index = e.currentTarget.dataset.index;
				this.isLike[index].flag = !this.isLike[index].flag
				if (this.isLike[index].flag) { // 点击了
					this.isLike[index].active = true;
					this.isDislike[index].active = false;
					this.isDislike[index].flag = false;
					this.reviewList[index].orderItemScore = 2;
					this.feedbackFlag = true;
				} else { // 取消了
					this.isLike[index].active = false;
					this.reviewList[index].orderItemScore = 1;
					this.feedbackFlag = false;
				}
			},
			// 踩一下
			hateMe(e) {
				var index = e.currentTarget.dataset.index;
				this.isDislike[index].flag = !this.isDislike[index].flag
				if (this.isDislike[index].flag) {
					this.isDislike[index].active = true;
					this.isLike[index].active = false;
					this.isLike[index].flag = false;
					this.reviewList[index].orderItemScore = 0;
					this.feedbackFlag = true;
				} else {
					this.isDislike[index].active = false;
					this.reviewList[index].orderItemScore = 1;
					this.feedbackFlag = false;
				}
			},
			// 完成
			done(e) {
				if (this.feedbackFlag) {
					var reviewDto = {}
					reviewDto.orderId = uni.getStorageSync('orderId');
					reviewDto.reviewList = this.reviewList;
					// console.log(reviewDto)
					var reviewDtoString = JSON.stringify(reviewDto)
					// console.log(reviewDtoString)

					// 传输评价数据到后台
					uni.request({
						url: this.serverUrl + '/wUpdateOrderItemScore',
						method: 'POST',
						data: reviewDtoString,
						success: res => {
							if (res.data == 1) {
								console.log('评价成功')
								uni.showToast({
									title: '评价成功！'
								});
								setTimeout(function() {
									uni.reLaunch({
										url: '../index/index'
									})
								}, 2000);
							} else {
								console.log('评价失败')
								uni.showToast({
									title: '评价失败！',
									image:'../../static/fail-white.png'
								});
							}
						},
						fail: () => {},
						complete: () => {}
					});
				} else {
					uni.showModal({
						title: '',
						content: '亲，还是给个评价吧',
						showCancel: true,
						cancelText: '哼，拒绝',
						confirmText: '好吧',
						success: res => {
							if (res.cancel) {
								console.log('没有评价。。。')
								uni.reLaunch({
									url: '../index/index'
								})
							}
						},
						fail: () => {},
						complete: () => {}
					});

				}
			}
		}
	}
</script>

<style>
	@import url("review.css");
</style>
